$(function () {
  // 点击去注册
  $('#link-reg').on('click', function () {
    // 显示注册页面
    $('.reg-box').show()
    // 隐藏登录页面
    $('.login-box').hide()
  })

  // 点击登录按钮
  $('#link-login').on('click', function () {
    // 显示登录页面
    $('.login-box').show()
    // 隐藏注册页面
    $('.reg-box').hide()
  })

  // 使用layui函数,自定义校验规则
  layui.form.verify({
    // 键值
    // 自定义校验规则的名字:自定义的校验规则
    uname: [/^[a-zA-Z0-9]{1,10}$/, '用户名必须是1-10位的字母或数字'],
    pwd: [/^\S{6,15}$/, '密码必须是6-15位的非空白字符'],
  
    // 判断密码是否一致
    repwd: function (value) {
      // repwd 给谁形参就是谁的值
      // 形参中的value是确认密码框中的值 
    // 获取第一次密码的值
      const int = $('.reg-box [name="password"]').val()
      // 判断密码是否一致
      if (value !== int) {
        // 不一致返回提示
        return '两次密码输入不一致'
      }
    }
  })

  // 监听注册表单的submit事件
  $('.reg-box form').on('submit', function (e) {
    // 阻止表单默认跳转
    e.preventDefault()
    // 发起post请求
    axios.post('/api/reg',$(this).serialize()).then(({data:res}) => {
      // 判断成功
      if (res.code === 0) {
        layer.msg('注册成功,请登录')
        // 模拟元素的点击行为
        $('#link-login').click()
      } else {
        // 失败
        layer.msg(res.message)
      }
    });
  })

  // 监听登录表单的submit事件
  $('.login-box form').on('submit', function (e) {
    // 阻止表单默认跳转
    e.preventDefault()
    // 发起post请求
    axios.post('/api/login', $(this).serialize()).then(({ data: res }) => {
      // 判断登录成功
      if (res.code === 0) {
        layer.msg('登录成功')
        // 把token 保存到本地存储中
        localStorage.setItem('token', res.token)
        // 跳转到主页面
        location.href = '/index.html'
      } else {
        // 失败
        layer.msg('登录失败')
        // 把token 从本地存储中删除
        localStorage.removeItem('token')
      }
    })
  })

  
})